'use strict';
import React, {Component, PropTypes} from 'react';
import { connect } from 'react-redux';
import './ButtonUpload.less';

class ComponentBox extends Component {
    constructor(props) {
        super(props);
        //console.log(this.props.options)
    }
    render() {
        return (
            <div className="fileupload fileupload-new" data-provides="fileupload">
                <span className="btn btn-primary btn-file">
                    <span className="fileupload-new">上传</span>
                    <input type="file" onChange={::this.onChange}  />
                </span>
            </div>
        );
    }
    onChange(event){
        let options = this.props.options !== undefined ? this.props.options : null;
        var reader  = new FileReader();
        let file = event.target.files[0];
        let {type,size,name} = file;
        //console.log(file.type)
        reader.addEventListener("load", () => {
            //console.log(reader.result.length,reader.result.substr(0,100));
            let content = reader.result.replace(`data:${type};base64,`,'');
            if(this.props.onChange) this.props.onChange({content,type,size,name},options);
        }, false);
        reader.readAsDataURL(file);
    }
}

export default ComponentBox;
